<!doctype html>
<html class="no-js">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>聊天</title>
    <!-- Set render engine for 360 browser -->
    <meta name="renderer" content="webkit">
    <!-- No Baidu Siteapp-->
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <!--<meta name="format-detection" content="telephone = no" />-->
    <!-- Add to homescreen for Chrome on Android -->
    <meta name="mobile-web-app-capable" content="yes">
    <!-- Add to homescreen for Safari on iOS -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="聊天" />
    <meta name="msapplication-TileColor" content="#090a0a">
    <link rel="stylesheet" href="__ROOT__/static/home/css/css_style.css">
    <script src="__ROOT__/static/home/css/userInfo/layer.mobile-v2.0/layer_mobile/layer.js"></script>
    <script src="__ROOT__/static/home/js/jquery-1.11.1.min.js"></script>
    <link href="__ROOT__/static/home/css/userInfo/layer.mobile-v2.0/layer_mobile/need/layer.css" rel="stylesheet"/>
    <link href="__ROOT__/static/home/css/userInfo/css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="__ROOT__/static/home/css/userInfo/css/style.css" />
    <link rel="stylesheet" href="__ROOT__/static/home/css/userInfo/css/top_nav.css" />
</head>

<script>
    //iframe 滑动条默认最下
    window.onload = function()
    {
        window.frames["x"].document.body.scrollTop = window.frames["x"].document.body.scrollHeight;
    }
</script>
<!--发消息-->
<script>
    $(function(){
        $('.send').click(function(){
            var params={};
            params.content = $('.content').val();
            params.userId = $('.userId').val();
            params.chatId = $('.chatId').val();
            $.ajax({

                        cache:true,
                        type:'POST',
                        url:"{:url('home/Userinfo/addChat')}" ,
                        data: params,
                        async:false,
                        success:function(data){
                            if(data==1){
//                                parent.frames.location.href='{:url("home/Userinfo/chat")}?friendId='+params.chatId;
                                parent.frames.location.reload();
                            }else{
                                layer.open({
                                    content: '发送失败'
                                    ,skin: 'msg'
                                    ,time: 2 //2秒后自动关闭
                                });
                            }
                        }

                    }
            )
        });
        <!--定时刷新-->

        setInterval(function setFlush(){
            parent.frames[0].location.reload();
        },5000);

    });


</script>
<body>
<div style="height: 50px;background-color: powderblue;">
    <div class="top_nav" style=""><a href="{:url('home/Userinfo/friends')}">< 返回</a></div>
    <div class="top_navC">{if condition="isset($friend['nickname'])"}{$friend['nickname']}{/if}</div>
    <div class="top_nav" id="save"></div>
</div>
    <iframe src="{:url('home/Userinfo/showChat',array('friendId'=>$friend['id']))}"  name="x" style="height:70%;width:100%">
    </iframe>
<textarea class="content" style="height:60px;width:100%" ></textarea>
<div style="width: 100%;text-align: right">
    <input type="button" value="发送" class="send">
    <input type="hidden" value="{$chatId}" class="chatId">
    <input type="hidden" value="{$userId}" class="userId">
</div>
</body>
</html>
